// 下拉菜单指令,添加open样式
export default {
    bind(el) {
        const handler = () => {
            // 从标记列表切换的 DOMString，首次点击添加open样式，再次删除
            el.parentElement.classList.toggle('open')
        }

        const documentHandler = (e) => {
            const target = e.target
            // 如果被绑定的节点与被点击的节点对象是同一节点，则返回
            // 被绑定的节点包含点击节点元素同样返回
            if (target.isSameNode(el) || el.contains(target)) return
            el.parentElement.classList.remove('open')
        }

        // 在冒泡阶段绑定点击事件监听器，以防万一在文档对象上亦绑定
        el.addEventListener('click', handler, false)
        document.addEventListener('click', documentHandler, false)

        el.destroy = () => {
            el.removeEventListener('click', handler, false)
            document.removeEventListener('click', documentHandler, false)
            el.destroy = null
        }
    },

    unbind(el) {
        el.destroy()
    }
}